<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		* {
		  margin: 0;
		  padding: 0;
		  box-sizing: border-box;
		  -webkit-font-smoothing: antialiased;
		}
		
		html {
		  font-size: 16px;
		}
		
		body {
		  font-family: "Roboto", sans-serif;
		  background: #222;
		}
		
		.container {
		  display: -webkit-box;
		  display: -moz-box;
		  display: box;
		  display: -webkit-flex;
		  display: -moz-flex;
		  display: -ms-flexbox;
		  display: flex;
		  position: relative;
		  z-index: 100;
		  -webkit-box-pack: center;
		  -moz-box-pack: center;
		  box-pack: center;
		  -webkit-justify-content: center;
		  -moz-justify-content: center;
		  -ms-justify-content: center;
		  -o-justify-content: center;
		  justify-content: center;
		  -ms-flex-pack: center;
		  -webkit-box-align: center;
		  -moz-box-align: center;
		  box-align: center;
		  -webkit-align-items: center;
		  -moz-align-items: center;
		  -ms-align-items: center;
		  -o-align-items: center;
		  align-items: center;
		  -ms-flex-align: center;
		  height: 100%;
		  height: 100vh;
		}
		
		.tree__row {
		  display: -webkit-box;
		  display: -moz-box;
		  display: box;
		  display: -webkit-flex;
		  display: -moz-flex;
		  display: -ms-flexbox;
		  display: flex;
		  -webkit-box-pack: center;
		  -moz-box-pack: center;
		  box-pack: center;
		  -webkit-justify-content: center;
		  -moz-justify-content: center;
		  -ms-justify-content: center;
		  -o-justify-content: center;
		  justify-content: center;
		  -ms-flex-pack: center;
		  -webkit-box-align: center;
		  -moz-box-align: center;
		  box-align: center;
		  -webkit-align-items: center;
		  -moz-align-items: center;
		  -ms-align-items: center;
		  -o-align-items: center;
		  align-items: center;
		  -ms-flex-align: center;
		}
		.tree__node {
		  z-index: 100;
		  width: 0;
		  height: 0;
		  margin: 0 -10px;
		  border-style: solid;
		  -webkit-transition: -webkit-transform 0.8s ease;
		  -moz-transition: -moz-transform 0.8s ease;
		  transition: transform 0.8s ease;
		  -webkit-transform: rotateY(0deg) scale(1.01);
		  -moz-transform: rotateY(0deg) scale(1.01);
		  -ms-transform: rotateY(0deg) scale(1.01);
		  -o-transform: rotateY(0deg) scale(1.01);
		  transform: rotateY(0deg) scale(1.01);
		  will-change: transform;
		  -webkit-animation-name: sparkle;
		  -moz-animation-name: sparkle;
		  animation-name: sparkle;
		  -webkit-animation-timing-function: ease;
		  -moz-animation-timing-function: ease;
		  animation-timing-function: ease;
		  -webkit-animation-duration: 1s;
		  -moz-animation-duration: 1s;
		  animation-duration: 1s;
		  -webkit-animation-iteration-count: infinite;
		  -moz-animation-iteration-count: infinite;
		  animation-iteration-count: infinite;
		}
		.tree__node:hover {
		  -webkit-transform: rotateY(180deg) scale(0.99);
		  -moz-transform: rotateY(180deg) scale(0.99);
		  -ms-transform: rotateY(180deg) scale(0.99);
		  -o-transform: rotateY(180deg) scale(0.99);
		  transform: rotateY(180deg) scale(0.99);
		}
		.tree__node:nth-of-type(odd) {
		  border-width: 0 20px 34.6px 20px;
		  border-top-color: transparent !important;
		  border-right-color: transparent !important;
		  border-bottom-color: #ff6d51;
		  border-left-color: transparent !important;
		}
		.tree__node:nth-of-type(even) {
		  border-width: 34.6px 20px 0 20px;
		  border-top-color: #f9d53a;
		  border-right-color: transparent !important;
		  border-bottom-color: transparent !important;
		  border-left-color: transparent !important;
		}
		.tree__node:nth-of-type(1n + 4) {
		  border-color: #f79fc5;
		}
		.tree__node:nth-of-type(2n + 4) {
		  border-color: #ff6d51;
		}
		.tree__node:nth-of-type(3n + 5) {
		  border-color: #f3b140;
		}
		.tree__node:nth-of-type(4n + 2) {
		  border-color: #f9d53a;
		}
		.tree__node:nth-of-type(5n + 3) {
		  border-color: #87b1d3;
		}
		.tree__node:nth-of-type(6n + 5) {
		  border-color: #5bd9c3;
		}
		.tree__node:nth-of-type(7n + 5) {
		  border-color: #7861be;
		}
		.tree__node:nth-of-type(8n + 5) {
		  border-color: #a9c688;
		}
		.tree__node:nth-of-type(1n + 2) {
		  -webkit-animation-duration: 1081ms;
		  -moz-animation-duration: 1081ms;
		  animation-duration: 1081ms;
		}
		.tree__node:nth-of-type(2n + 7) {
		  -webkit-animation-duration: 2333ms;
		  -moz-animation-duration: 2333ms;
		  animation-duration: 2333ms;
		}
		.tree__node:nth-of-type(3n + 2) {
		  -webkit-animation-duration: 1563ms;
		  -moz-animation-duration: 1563ms;
		  animation-duration: 1563ms;
		}
		.tree__node:nth-of-type(4n + 2) {
		  -webkit-animation-duration: 1684ms;
		  -moz-animation-duration: 1684ms;
		  animation-duration: 1684ms;
		}
		.tree__node:nth-of-type(5n + 3) {
		  -webkit-animation-duration: 2292ms;
		  -moz-animation-duration: 2292ms;
		  animation-duration: 2292ms;
		}
		.tree__node:nth-of-type(6n + 6) {
		  -webkit-animation-duration: 1403ms;
		  -moz-animation-duration: 1403ms;
		  animation-duration: 1403ms;
		}
		.tree__node:nth-of-type(7n + 4) {
		  -webkit-animation-duration: 1627ms;
		  -moz-animation-duration: 1627ms;
		  animation-duration: 1627ms;
		}
		.tree__node:nth-of-type(8n + 5) {
		  -webkit-animation-duration: 1207ms;
		  -moz-animation-duration: 1207ms;
		  animation-duration: 1207ms;
		}
		
		.snow {
		  position: absolute;
		  z-index: 1;
		  top: 0;
		  width: 100%;
		  height: 100%;
		  opacity: 0.3;
		  overflow: hidden;
		}
		.snow__flake {
		  position: absolute;
		  top: -300px;
		  left: 0;
		  width: 300px;
		  height: 100%;
		  background-repeat: no-repeat;
		  background-size: 300px 1200px;
		  background-position: top left;
		  background-image: url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-1.png);
		  -webkit-animation-name: snowflake;
		  -moz-animation-name: snowflake;
		  animation-name: snowflake;
		  -webkit-animation-timing-function: linear;
		  -moz-animation-timing-function: linear;
		  animation-timing-function: linear;
		  -webkit-animation-duration: 10s;
		  -moz-animation-duration: 10s;
		  animation-duration: 10s;
		  -webkit-animation-iteration-count: infinite;
		  -moz-animation-iteration-count: infinite;
		  animation-iteration-count: infinite;
		}
		.snow__flake:nth-of-type(1n) {
		  left: 2.5%;
		  -webkit-animation-duration: 3175ms;
		  -moz-animation-duration: 3175ms;
		  animation-duration: 3175ms;
		}
		.snow__flake:nth-of-type(2n) {
		  left: 5%;
		  -webkit-animation-duration: 2231ms;
		  -moz-animation-duration: 2231ms;
		  animation-duration: 2231ms;
		}
		.snow__flake:nth-of-type(3n) {
		  left: 7.5%;
		  -webkit-animation-duration: 2528ms;
		  -moz-animation-duration: 2528ms;
		  animation-duration: 2528ms;
		}
		.snow__flake:nth-of-type(4n) {
		  left: 10%;
		  -webkit-animation-duration: 3456ms;
		  -moz-animation-duration: 3456ms;
		  animation-duration: 3456ms;
		}
		.snow__flake:nth-of-type(5n) {
		  left: 12.5%;
		  -webkit-animation-duration: 3834ms;
		  -moz-animation-duration: 3834ms;
		  animation-duration: 3834ms;
		}
		.snow__flake:nth-of-type(6n) {
		  left: 15%;
		  -webkit-animation-duration: 3262ms;
		  -moz-animation-duration: 3262ms;
		  animation-duration: 3262ms;
		}
		.snow__flake:nth-of-type(7n) {
		  left: 17.5%;
		  -webkit-animation-duration: 1906ms;
		  -moz-animation-duration: 1906ms;
		  animation-duration: 1906ms;
		}
		.snow__flake:nth-of-type(8n) {
		  left: 20%;
		  -webkit-animation-duration: 3107ms;
		  -moz-animation-duration: 3107ms;
		  animation-duration: 3107ms;
		}
		.snow__flake:nth-of-type(9n) {
		  left: 22.5%;
		  -webkit-animation-duration: 3544ms;
		  -moz-animation-duration: 3544ms;
		  animation-duration: 3544ms;
		}
		.snow__flake:nth-of-type(10n) {
		  left: 25%;
		  -webkit-animation-duration: 3891ms;
		  -moz-animation-duration: 3891ms;
		  animation-duration: 3891ms;
		}
		.snow__flake:nth-of-type(11n) {
		  left: 27.5%;
		  -webkit-animation-duration: 2295ms;
		  -moz-animation-duration: 2295ms;
		  animation-duration: 2295ms;
		}
		.snow__flake:nth-of-type(12n) {
		  left: 30%;
		  -webkit-animation-duration: 3621ms;
		  -moz-animation-duration: 3621ms;
		  animation-duration: 3621ms;
		}
		.snow__flake:nth-of-type(13n) {
		  left: 32.5%;
		  -webkit-animation-duration: 2826ms;
		  -moz-animation-duration: 2826ms;
		  animation-duration: 2826ms;
		}
		.snow__flake:nth-of-type(14n) {
		  left: 35%;
		  -webkit-animation-duration: 2018ms;
		  -moz-animation-duration: 2018ms;
		  animation-duration: 2018ms;
		}
		.snow__flake:nth-of-type(15n) {
		  left: 37.5%;
		  -webkit-animation-duration: 3034ms;
		  -moz-animation-duration: 3034ms;
		  animation-duration: 3034ms;
		}
		.snow__flake:nth-of-type(16n) {
		  left: 40%;
		  -webkit-animation-duration: 3814ms;
		  -moz-animation-duration: 3814ms;
		  animation-duration: 3814ms;
		}
		.snow__flake:nth-of-type(17n) {
		  left: 42.5%;
		  -webkit-animation-duration: 3187ms;
		  -moz-animation-duration: 3187ms;
		  animation-duration: 3187ms;
		}
		.snow__flake:nth-of-type(18n) {
		  left: 45%;
		  -webkit-animation-duration: 3289ms;
		  -moz-animation-duration: 3289ms;
		  animation-duration: 3289ms;
		}
		.snow__flake:nth-of-type(19n) {
		  left: 47.5%;
		  -webkit-animation-duration: 2345ms;
		  -moz-animation-duration: 2345ms;
		  animation-duration: 2345ms;
		}
		.snow__flake:nth-of-type(20n) {
		  left: 50%;
		  -webkit-animation-duration: 1972ms;
		  -moz-animation-duration: 1972ms;
		  animation-duration: 1972ms;
		}
		.snow__flake:nth-of-type(21n) {
		  left: 52.5%;
		  -webkit-animation-duration: 3906ms;
		  -moz-animation-duration: 3906ms;
		  animation-duration: 3906ms;
		}
		.snow__flake:nth-of-type(22n) {
		  left: 55%;
		  -webkit-animation-duration: 1806ms;
		  -moz-animation-duration: 1806ms;
		  animation-duration: 1806ms;
		}
		.snow__flake:nth-of-type(23n) {
		  left: 57.5%;
		  -webkit-animation-duration: 1472ms;
		  -moz-animation-duration: 1472ms;
		  animation-duration: 1472ms;
		}
		.snow__flake:nth-of-type(24n) {
		  left: 60%;
		  -webkit-animation-duration: 2307ms;
		  -moz-animation-duration: 2307ms;
		  animation-duration: 2307ms;
		}
		.snow__flake:nth-of-type(25n) {
		  left: 62.5%;
		  -webkit-animation-duration: 3548ms;
		  -moz-animation-duration: 3548ms;
		  animation-duration: 3548ms;
		}
		.snow__flake:nth-of-type(26n) {
		  left: 65%;
		  -webkit-animation-duration: 2002ms;
		  -moz-animation-duration: 2002ms;
		  animation-duration: 2002ms;
		}
		.snow__flake:nth-of-type(27n) {
		  left: 67.5%;
		  -webkit-animation-duration: 2720ms;
		  -moz-animation-duration: 2720ms;
		  animation-duration: 2720ms;
		}
		.snow__flake:nth-of-type(28n) {
		  left: 70%;
		  -webkit-animation-duration: 3799ms;
		  -moz-animation-duration: 3799ms;
		  animation-duration: 3799ms;
		}
		.snow__flake:nth-of-type(29n) {
		  left: 72.5%;
		  -webkit-animation-duration: 2353ms;
		  -moz-animation-duration: 2353ms;
		  animation-duration: 2353ms;
		}
		.snow__flake:nth-of-type(30n) {
		  left: 75%;
		  -webkit-animation-duration: 3535ms;
		  -moz-animation-duration: 3535ms;
		  animation-duration: 3535ms;
		}
		.snow__flake:nth-of-type(31n) {
		  left: 77.5%;
		  -webkit-animation-duration: 3580ms;
		  -moz-animation-duration: 3580ms;
		  animation-duration: 3580ms;
		}
		.snow__flake:nth-of-type(32n) {
		  left: 80%;
		  -webkit-animation-duration: 1034ms;
		  -moz-animation-duration: 1034ms;
		  animation-duration: 1034ms;
		}
		.snow__flake:nth-of-type(33n) {
		  left: 82.5%;
		  -webkit-animation-duration: 1484ms;
		  -moz-animation-duration: 1484ms;
		  animation-duration: 1484ms;
		}
		.snow__flake:nth-of-type(34n) {
		  left: 85%;
		  -webkit-animation-duration: 3908ms;
		  -moz-animation-duration: 3908ms;
		  animation-duration: 3908ms;
		}
		.snow__flake:nth-of-type(35n) {
		  left: 87.5%;
		  -webkit-animation-duration: 3182ms;
		  -moz-animation-duration: 3182ms;
		  animation-duration: 3182ms;
		}
		.snow__flake:nth-of-type(36n) {
		  left: 90%;
		  -webkit-animation-duration: 4000ms;
		  -moz-animation-duration: 4000ms;
		  animation-duration: 4000ms;
		}
		.snow__flake:nth-of-type(37n) {
		  left: 92.5%;
		  -webkit-animation-duration: 1942ms;
		  -moz-animation-duration: 1942ms;
		  animation-duration: 1942ms;
		}
		.snow__flake:nth-of-type(38n) {
		  left: 95%;
		  -webkit-animation-duration: 2066ms;
		  -moz-animation-duration: 2066ms;
		  animation-duration: 2066ms;
		}
		.snow__flake:nth-of-type(39n) {
		  left: 97.5%;
		  -webkit-animation-duration: 1260ms;
		  -moz-animation-duration: 1260ms;
		  animation-duration: 1260ms;
		}
		.snow__flake:nth-of-type(40n) {
		  left: 100%;
		  -webkit-animation-duration: 2053ms;
		  -moz-animation-duration: 2053ms;
		  animation-duration: 2053ms;
		}
		.snow__flake:nth-of-type(2n) {
		  background-image: url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-2.png);
		}
		.snow__flake:nth-of-type(3n) {
		  background-image: url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-3.png);
		}
		.snow__flake:nth-of-type(4n) {
		  background-image: url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-4.png);
		}
		
		.message {
		  display: block;
		  position: fixed;
		  z-index: 500;
		  right: 20px;
		  bottom: 20px;
		  width: 280px;
		  padding: 20px;
		  background: rgba(255, 255, 255, 0.4);
		}
		.message__text {
		  margin: 0 0 14px 0;
		  font-size: 0.875rem;
		  font-weight: 400;
		  line-height: 1.25;
		  color: #fff;
		}
		.message__text:last-of-type {
		  margin: 0;
		}
		.message__text a {
		  color: #f3b140;
		  text-decoration: none;
		  -webkit-transition: color 0.25s ease-in-out;
		  -moz-transition: color 0.25s ease-in-out;
		  transition: color 0.25s ease-in-out;
		}
		.message__text a:hover, .message__text a:focus {
		  color: #f9d8a0;
		}
		
		@-webkit-keyframes sparkle {
		  0% {
		    opacity: 1;
		  }
		  50% {
		    opacity: 0.5;
		  }
		  100% {
		    opacity: 1;
		  }
		}
		@-moz-keyframes sparkle {
		  0% {
		    opacity: 1;
		  }
		  50% {
		    opacity: 0.5;
		  }
		  100% {
		    opacity: 1;
		  }
		}
		@keyframes sparkle {
		  0% {
		    opacity: 1;
		  }
		  50% {
		    opacity: 0.5;
		  }
		  100% {
		    opacity: 1;
		  }
		}
		@-webkit-keyframes snowflake {
		  0% {
		    opacity: 0;
		    -webkit-transform: translate3d(0, 0, 0);
		  }
		  40% {
		    opacity: 1;
		  }
		  80% {
		    opacity: 1;
		  }
		  100% {
		    opacity: 0;
		    -webkit-transform: translate3d(60%, 120%, 0);
		  }
		}
		@-moz-keyframes snowflake {
		  0% {
		    opacity: 0;
		    -moz-transform: translate3d(0, 0, 0);
		  }
		  40% {
		    opacity: 1;
		  }
		  80% {
		    opacity: 1;
		  }
		  100% {
		    opacity: 0;
		    -moz-transform: translate3d(60%, 120%, 0);
		  }
		}
		@keyframes snowflake {
		  0% {
		    opacity: 0;
		    -webkit-transform: translate3d(0, 0, 0);
		    -moz-transform: translate3d(0, 0, 0);
		    -ms-transform: translate3d(0, 0, 0);
		    -o-transform: translate3d(0, 0, 0);
		    transform: translate3d(0, 0, 0);
		  }
		  40% {
		    opacity: 1;
		  }
		  80% {
		    opacity: 1;
		  }
		  100% {
		    opacity: 0;
		    -webkit-transform: translate3d(60%, 120%, 0);
		    -moz-transform: translate3d(60%, 120%, 0);
		    -ms-transform: translate3d(60%, 120%, 0);
		    -o-transform: translate3d(60%, 120%, 0);
		    transform: translate3d(60%, 120%, 0);
		  }
		}
	</style>
	<body>
		<div class="container">
		  <div class="tree">
		    <div class="tree__row">
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		    <div class="tree__row">
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		      <div class="tree__node"></div>
		    </div>
		  </div>
		</div>
		<div class="snow">
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		  <div class="snow__flake"></div>
		</div>
		
		<div class="message">
		  <p class="message__text">Refresh this pen in edit view to see a random() tree colour and animation pattern.</p>
		  <p class="message__text">Merry Christmas from <a href="https://twitter.com/namboozle" title="Andrew Hawkes on Twitter" target="_blank">@namboozle</></p>
		</div>
	</body>
</html>
